<?xml version='1.0' encoding='ISO-8859-1' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
    </h:head>
    <h:body>
        <ui:composition>
            <p:tabView id="PersonaTabView" dynamic="true" activeIndex="#{bPersona.activeTabIndex}" orientation="top"
                           style="font-family: Arial, Helvetica, sans-serif;font-size: 14px; font-weight: bold">
                <!-- tab para registrar al cliente -->
                <p:tab id="tabCliente" title="#{msg.resgistroUsuario}">
                    <h:form id="formRegistroCliente" styleClass="textoTab">
                        <p:growl globalOnly="true"  id="estadoRegistraCliente" sticky="false"  showDetail="true"  />
                        <p:panel id="datosRegistro" header="#{msg.datosPersona}" >
                            <h:panelGrid columns="2"  cellpadding="2"  cellspacing="6" columnClasses="labelOT, valueOT"  >

                                <h:outputText  value="#{msg.email} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:inputText id="emailCliente" value="#{bPersona.objPersonaRegistra.objUsuarioPersona.codigoUsuario}" 
                                                 size="45" maxlength="40"  required="true" requiredMessage="#{msg.datoRequerido}" 
                                                 validatorMessage="#{msg.datoValidacion}" title="Max 40 caracteres">
                                       <f:validateLength minimum="2" maximum="40" />
                                   </p:inputText>
                                   <h:message for="emailCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>

                                <h:outputText  value="#{msg.clave} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:password id="claveCliente" value="#{bPersona.objPersonaRegistra.objUsuarioPersona.claveUsuario}" 
                                                size="20" label="Clave" required="true" feedback="true" title="Max 16 caracteres"
                                                requiredMessage="#{msg.datoRequerido}" validatorMessage="#{msg.datoValidacion}"/> 
                                    <h:message for="claveCliente" showDetail="false" showSummary="true" styleClass="errors" />
                                </h:panelGroup>                                    

                                <h:outputText  value="#{msg.nombre} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:inputText id="nombreCliente" value="#{bPersona.objPersonaRegistra.nombrePersona}" 
                                                 size="45" maxlength="30"  required="true" requiredMessage="#{msg.datoRequerido}" 
                                                 validatorMessage="#{msg.datoValidacion}" title="Max 30 letras">
                                       <f:validateLength minimum="2" maximum="30" />
                                   </p:inputText>
                                   <h:message for="nombreCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>

                                <h:outputText  value="#{msg.apellidoPaterno} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:inputText id="paternoCliente" value="#{bPersona.objPersonaRegistra.paternoPersona}" 
                                                 size="45" maxlength="30"  required="true" requiredMessage="#{msg.datoRequerido}" 
                                                 validatorMessage="#{msg.datoValidacion}" title="Max 30 letras">
                                       <f:validateLength minimum="2" maximum="30" />
                                   </p:inputText>
                                   <h:message for="paternoCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>

                                <h:outputText  value="#{msg.apellidoMaterno} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:inputText id="maternoCliente" value="#{bPersona.objPersonaRegistra.maternoPersona}" 
                                                 size="45" maxlength="30"  required="true" requiredMessage="#{msg.datoRequerido}" 
                                                 validatorMessage="#{msg.datoValidacion}" title="Max 30 letras">
                                       <f:validateLength minimum="2" maximum="30" />
                                   </p:inputText>
                                   <h:message for="maternoCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>

                                <h:outputText  value="#{msg.documentoIdentidad} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:inputMask id="codigoCliente" value="#{bPersona.objPersonaRegistra.codigoPersona}" 
                                                 size="15" maxlength="8"  required="true" requiredMessage="#{msg.datoRequerido}" 
                                                 validatorMessage="#{msg.datoValidacion}" title="Max 8 numeros"  
                                                 mask="99999999">
                                        <f:validateLength minimum="8" maximum="8" />
                                    </p:inputMask>
                                   <h:message for="codigoCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>

                                <h:outputText value="#{msg.genero} (*)" style="width: 350px;font-weight: bold;"/>
                                <h:panelGroup>
                                    <p:selectOneMenu rendered="true" requiredMessage="#{msg.datoRequerido}" id="generoCliente"
                                                     effect="fade" value="#{bPersona.objPersonaRegistra.generoPersona}" required="true">
                                        <f:selectItem itemLabel="#{msg.elegir}" itemValue=""/>
                                        <f:selectItems value="#{parametro.getCargarCombosParametro('GENERO')}"/>
                                    </p:selectOneMenu>
                                    <h:message for="generoCliente" showDetail="false" showSummary="true" styleClass="errors"/>
                                </h:panelGroup>

                                <h:outputText  value="#{msg.fechaNacimiento} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:calendar id="fechaNacimientoCliente" style="width:160px" effect="explode" value="#{bPersona.objPersonaRegistra.nacimientoPersona}" 
                                                required="true" navigator="true" pattern="dd/MM/yyyy" yearRange="1923"
                                                requiredMessage="#{msg.datoRequerido}" validatorMessage="#{msg.datoValidacion}"/>
                                    <h:message for="fechaNacimientoCliente" showDetail="false" showSummary="true" styleClass="errors"/> 
                                </h:panelGroup>

                                <h:outputText  value="#{msg.pais} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:selectOneMenu rendered="true" requiredMessage="#{msg.datoRequerido}" id="paisCliente"
                                                     effect="fade" value="#{bPersona.objPersonaRegistra.paisPersona}" required="true">
                                        <f:selectItem itemLabel="#{msg.elegir}" itemValue=""/>
                                        <f:selectItems value="#{parametro.getCargarCombosParametro('PAIS')}" />
                                    </p:selectOneMenu>
                                   <h:message for="paisCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>

                                <h:outputText  value="#{msg.ciudad} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:selectOneMenu rendered="true" requiredMessage="#{msg.datoRequerido}" id="ciudadCliente"
                                                     effect="fade" value="#{bPersona.objPersonaRegistra.ciudadPersona}" required="true">
                                        <f:selectItem itemLabel="#{msg.elegir}" itemValue=""/>
                                        <f:selectItems value="#{parametro.getCargarCombosParametro('CIUDAD')}" />
                                    </p:selectOneMenu>
                                    <h:message for="ciudadCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>

                                <h:outputText  value="#{msg.direccion} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>                                        
                                    <p:inputTextarea id="direccionCliente" rows="2" cols="50" counter="counter_com" maxlength="100"    
                                                     required="true"   requiredMessage="#{msg.datoRequerido}" title="Max 100 caracteres"
                                                     counterTemplate="{0} Caracteres faltantes." autoResize="true" value="#{bPersona.objPersonaRegistra.direccionPersona}"/><br />
                                    <h:outputText id="counter_com" /> 
                                    <h:message for="direccionCliente" showDetail="false" showSummary="true" styleClass="errors" />
                                </h:panelGroup> 

                                <h:outputText  value="#{msg.telefono} (*)"  style="width:350px;font-weight:bold;"/>
                                <h:panelGroup>
                                    <p:inputText id="telefonoCliente" value="#{bPersona.objPersonaRegistra.telefonoPersona}" 
                                                 size="35" maxlength="30"  required="true" requiredMessage="#{msg.datoRequerido}" 
                                                 validatorMessage="#{msg.datoValidacion}" title="Max 30 letras">
                                       <f:validateLength minimum="6" maximum="30" />
                                   </p:inputText>
                                   <h:message for="telefonoCliente" showDetail="false" showSummary="true" styleClass="errors"/>                                
                                </h:panelGroup>
                                <p align="center">                                   
                                    <h:panelGrid columns="2" cellpadding="10"  cellspacing="10" style="text-align: center;" width="90%">                                                                    
                                        <h:panelGroup>
                                            <h:panelGrid columns="1" cellpadding="2"  cellspacing="2" style="text-align: center;" width="160%">
                                                <p:commandButton icon="ui-icon-arrowrefresh-1-w" actionListener="#{bPersona.doIniciarRegistroCliente()}" 
                                                                 value="#{msg.limpiar}" async="true" update="formRegistroCliente"  />
                                            </h:panelGrid>
                                        </h:panelGroup>
                                        <h:panelGroup>
                                            <h:panelGrid columns="1" cellpadding="2"  cellspacing="2" style="text-align: center;" width="60%">
                                                <p:commandButton icon="ui-icon-disk" actionListener="#{bPersona.doRegistrarCliente()}"  
                                                                 value="#{msg.guardar}" async="true" update="formRegistroCliente, estadoRegistraCliente" global="false"/>                                            
                                            </h:panelGrid>
                                        </h:panelGroup>  
                                    </h:panelGrid>
                               </p>
                            </h:panelGrid>
                        </p:panel>
                    </h:form>
                </p:tab>

            </p:tabView>
        </ui:composition>
    </h:body>
</html>

